$(document).ready(function() {
    $('ul.share li a img').hover(
        function() {
            $(this).stop().animate({'margin-top':'0px'}, "fast");
        },
        function() {
            $(this).stop().animate({'margin-top':'-50px'}, "fast");
        }
    );

    //move the last list item before the first item. The purpose of this is if the user clicks previous he will be able to see the last item.
    $('#carousel_ul li:first').before($('#carousel_ul li:last'));
    $('div.clients-wrapper ul li:first').before($('div.clients-wrapper ul li:last'));
    $('.clients-wrapper ul').css({'left' : '-170px'});
    //when user clicks the image for sliding right


    $('#left_scroll').click(function() {
        //get the width of the items ( i like making the jquery part dynamic, so if you change the width in the css you won't have o change it here too ) '
        var item_width = $('#carousel_ul li').outerWidth() + 10;
        //calculate the new left indent of the unordered list
        var left_indent = parseInt($('#carousel_ul').css('left')) - item_width;
        //make the sliding effect using jquery's anumate function '
        if ($('#carousel_ul').is(':animated') == false) {
            $('#carousel_ul').animate({'left' : left_indent}, function() {
                //get the first list item and put it after the last list item (that's how the infinite effects is made) '
                $('#carousel_ul li:last').after($('#carousel_ul li:first'));
                //and get the left indent to the default -210px
                $('#carousel_ul').css({'left' : '-137px'});
            });
        }
    });


    //when user clicks the image for sliding left
    $('#right_scroll').click(function() {
        var item_width = $('#carousel_ul li').outerWidth() + 10;
        /* same as for sliding right except that it's current left indent + the item width (for the sliding right it's - item_width) */
        var left_indent = parseInt($('#carousel_ul').css('left')) + item_width;
        if ($('#carousel_ul').is(':animated') == false) {
            $('#carousel_ul').animate({'left' : left_indent}, function() {
                /* when sliding to left we are moving the last item before the first item */
                $('#carousel_ul li:first').before($('#carousel_ul li:last'));
                /* and again, when we make that change we are setting the left indent of our unordered list to the default -210px */
                $('#carousel_ul').css({'left' : '-137px'});
            });
        }
    });

    $('#soc_ans').click(
        function() {
            var data = $("#soc_asking :radio:checked").val();
            if (!data) {
                return;
            }
            alert("Data Loaded: " + data);
        });
    $('ul.items li a img').mouseover(function() {
        if ($(this).is(':animated') == false) {
            $(this).animate({'margin-top':'-90px'}, "fast");
        }
    });
    $('ul.items li a img').mouseout(function() {

        $(this).animate({'margin-top':'0px'}, "fast");

    });

    $('#button_left').mouseover(
        function() {
            $(this).css("background-position", "0px -60px");
        }
    );
    $('#button_left').mouseout(
        function() {
            $(this).css("background-position", "0px 0px");
        }
    );
    $('#button_right').mouseover(
        function() {
            $(this).css("background-position", "0px -180px");
        }
    );
    $('#button_right').mouseout(
        function() {
            $(this).css("background-position", "0px -120px");
        }
    );


    $('#button_left').click(
        function() {
            var item_width = $('div.clients-wrapper ul li').outerWidth() + 10;
            //calculate the new left indent of the unordered list
            var left_indent = parseInt($('div.clients-wrapper ul').css('left')) - item_width;
            //make the sliding effect using jquery's anumate function '
            if ($('.clients-wrapper ul').is(':animated') == false) {
                $('.clients-wrapper ul').animate({'left' : left_indent}, function() {
                    //get the first list item and put it after the last list item (that's how the infinite effects is made) '
                    $('.clients-wrapper ul li:last').after($('div.clients-wrapper ul li:first'));
                    //and get the left indent to the default -210px
                    $('.clients-wrapper ul').css({'left' : '-170px'});
                });
            }
        }
    );

    $('#button_right').click(
        function() {
            var item_width = $('div.clients-wrapper ul li').outerWidth() + 10;
            //calculate the new left indent of the unordered list
            var left_indent = parseInt($('div.clients-wrapper ul').css('left')) + item_width;
            //make the sliding effect using jquery's anumate function '
            if ($('.clients-wrapper ul').is(':animated') == false) {
                $('.clients-wrapper ul').animate({'left' : left_indent}, function() {
                    //get the first list item and put it after the last list item (that's how the infinite effects is made) '
                    $('.clients-wrapper ul li:first').before($('div.clients-wrapper ul li:last'));
                    //and get the left indent to the default -210px
                    $('.clients-wrapper ul').css({'left' : '-170px'});
                });
            }
        }
    );
    $('ul.flags li.flag img').mouseover(function() {
        $(this).css("margin-top", "-20px");
    });
    $('ul.flags li.flag img').mouseout(function() {
        $(this).css("margin-top", "0px");
    });

    $('.coun_item').hover(
        function() {
            $(this).css({ "background-color": "#bfea13"});
        },
        function() {
            $(this).css({ "background-color": "#d2f05d"});
        }
    );

    $('.coun_item').click(
        function() {
            document.location = "#";
        }
    );

    $('.coun_item_on').hover(
        function() {
            $(this).css({ "background-color": "#bfea13"});
        },
        function() {
            $(this).css({ "background-color": "#fff600"});
        }
    );

    $('.content_list_item').hover(
        function() {
            $(this).css("border", " 1px solid #b0e010");
        },
        function() {
            $(this).css("border", " 1px solid #AAAAAA");
        }
    );

    $('.content_list_item').click(
        function() {
            document.location = "#";
        }
    );


//client carousel****************************************************************

    $('#prev_img').click(
        function() {
            if (!$('.clien_carousel').is(':animated')) {
                $('.clien_carousel').animate({"left":"-=132px"}, function() {
                    $('.clien_carousel li:last').after($('.clien_carousel li:first'));
                    $('.clien_carousel').css({'left' : '-132px'});
                });
            }
        }
    );

    $('#next_img').click(
        function() {
            if (!$('.clien_carousel').is(':animated')) {
                $('.clien_carousel').animate({"left":"+=132px"}, function() {
                    $('.clien_carousel li:first').before($('.clien_carousel li:last'));
                    $('.clien_carousel').css({'left' : '-132px'});
                });
            }
        }
    );

    $('#prev_img').hover(function() {
        $('#prev_img .arrow_hider img').css('margin-top', '-60px');
    }, function() {
        $('#prev_img .arrow_hider img').css('margin-top', '0px');
    });

    $('#next_img').hover(function() {
        $('#next_img .arrow_hider img').css('margin-top', '-180px');
    }, function() {
        $('#next_img .arrow_hider img').css('margin-top', '-120px');
    });
//client carousel end****************************************************************
    /* This is basic - uses default settings */


    /* Apply fancybox to multiple items */

    $("a.group").fancybox({
        'transitionIn' : 'elastic',
        'transitionOut' : 'elastic',
        'speedIn' : 1000,
        'speedOut' : 200,
        'overlayShow' : true
    });

    $('#logein').fancybox({
        'scrolling'        : 'no',
        'titleShow'        : false,
        'onClosed'        : function() {
            $("#login_error").hide();
        }
    });

    $('#reg').fancybox({
        'scrolling'        : 'no',
        'titleShow'        : false,
        'onClosed'        : function() {
            $("#login_error").hide();
        }
    });
});

